<template>

    <body>
        <el-form label-width="100">
            <el-form-item label="用户名" prop="userName">
                <el-input v-model="model.userName" />
            </el-form-item>
            <el-form-item label="密码" prop="password">
                <el-input show-password v-model="model.password" />
            </el-form-item>
            <el-form-item label="验证码" prop="setCode">
                <el-input v-model="model.setCode" style="width: 100px;height: 30px;" />&nbsp;
                <el-tag type="danger" size="large" style="font-size: 20px;">{{ model.showCode }}</el-tag>
            </el-form-item>
            <el-form-item label=" " prop="setCode">
                <el-checkbox v-model="model.getPass" /> 记住密码
            </el-form-item>
            <el-form-item>
                <el-button type="success" @click="Logins">登录</el-button>
            </el-form-item>

        </el-form>
    </body>

</template>

<script setup lang="ts">
import { ref, onMounted, reactive } from 'vue';
import axios from 'axios';
import { ElMessage } from 'element-plus';
import passport from '@/Utils/axiosHelper'
const model = reactive({
    userName: "",
    password: "",
    showCode: "",
    setCode: "",
    getPass: false
})
//数字与字母组合
const Yzm = () => {
    var yzma = "1234567890qwertyuioplkjhgfdsazxcvbnmQWERTYUIOPLKJHGFDSAZXCVBNM";
    for (let i = 0; i < 4; i++) {
        var index = Math.floor(Math.random() * yzma.length);
        model.showCode += yzma[index]
    }
}
let sums = 0;
const Yzm1 = () => {
    var m = Math.floor(Math.random() * 10);
    var s = Math.ceil(Math.random() * 9);
    var j = "+-*/";
    var a = Math.floor(Math.random() * j.length);
    let index = j[a]
    // if (index == "/") {
    //     m = m * s;
    // }
    model.showCode = m + index + s + "=?"

    switch (index) {
        case "+":
            sums = m + s;
            break
        case "-":
            sums = m - s;
            break
        case "*":
            sums = m * s;
            break
        case "/":
            if (m % s == 0) {
                sums = m / s;
                break
            }
            else {
                Yzm1()
                return
            }


    }

}


const Logins = () => {
    if (model.setCode != sums.toString()) {
        ElMessage.error("验证码不正确")
        return;
    }
    passport.post("/api/Management/Logins", model).then(res => {
        if (res.data.code == 100) {
            ElMessage.success(res.data.message);
        }
        else {
            ElMessage.error(res.data.message)
        }
    })
}
onMounted(() => {
    // Yzm();
    Yzm1()
})
</script>

<style scoped>
@media (min-width: 1024px) {
    body {
        display: grid;
        place-items: center;
    }
}
</style>
